<template>
    <section>
        <el-tabs type="border-card" v-model="tab">
            <el-tab-pane label="尺码" name="size">
                <size-list ref="size" :nodeActions="nodeActions"></size-list>
            </el-tab-pane>
            <el-tab-pane label="身高" name="height">
                <height-list ref="height" :nodeActions="nodeActions"></height-list>
            </el-tab-pane>
            <el-tab-pane label="胸围" name="bust">
                <bust-list ref="bust" :nodeActions="nodeActions"></bust-list>
            </el-tab-pane>
            <el-tab-pane label="腰围" name="waist">
                <waist-list ref="waist" :nodeActions="nodeActions"></waist-list>
            </el-tab-pane>
        </el-tabs>
    </section>
</template>

<script>
import sizeList from "@/view/bs/components/sizeList";
import heightList from "@/view/bs/components/heightList";
import bustList from "@/view/bs/components/bustList";
import waistList from "@/view/bs/components/waistList";
export default {
    name: "bs_size",
    components: {
        sizeList,
        heightList,
        bustList,
        waistList
    },
    watch:{
        tab(value){
            if(!this.$refs[value].isLoad){
                this.$refs[value].isLoad = true;
                this.$refs[value].searchBtn();
            }
        }
    },
    created() {
        this.user = this.$store.getters.user;
        this.nodeActions = this.user.node_actions[this.$route.meta.id] ? this.user.node_actions[this.$route.meta.id] : [];
    },
    data() {
        return {
            tab: 'size',
            user: {},
            nodeActions: [],
        }
    },
    mounted() {
        this.$refs[this.tab].isLoad = true;
        this.$refs[this.tab].searchBtn();
    }
}
</script>

<style scoped>

</style>
